<template>
	<view>
		<view class="top">
			
		</view>
		
		<view class="bottom">
			<view class="carlist">
				<van-radio-group v-model="radio">
				<view class="caritem">
					<view class="carimage">
						<image src="/static/奔驰e300.jpeg" mode=""></image>
					</view>
					<view class="carinfo">
						<view class="carmodels">
							车型：奔驰E300
						</view>
						
						<view class="carlicense ">
							车牌：沪AZRZN（哲然最牛）
						</view>
					</view>
					<view class="choose">
						<van-radio name="1"/>
					</view>
				</view>
				
				<view class="caritem">
					<view class="carimage">
						<image src="/static/奔驰e300.jpeg" mode=""></image>
					</view>
					<view class="carinfo">
						<view class="carmodels">
							车型：奔驰E300
						</view>
						
						<view class="carlicense ">
							车牌：沪AZRZN（哲然最牛）
						</view>
					</view>
					<view class="choose">
						<van-radio name="2"/>
					</view>
				</view>
				</van-radio-group>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				  radio: '1',
			}
		},
		methods: {
			
		}
	}
</script>

<style scoped>
	.top{
		height: 20vh;
		background-color: #1f73f1;
	}
	.bottom{
		padding: 20rpx;
		background-color: #f8f8f8;
		min-height: 75vh;
		padding-bottom: 120rpx;
	}

	.carimage{
		width: 180rpx;
		height: 180rpx;
	}
	.carimage image{
		width: 180rpx;
		height: 180rpx;
		border-radius: 100%;
	}
	.caritem{
		display: flex;
		align-items: center;
		background-color: #ffffff;
		height: 200rpx;
		padding: 40rpx;
		border-radius: 30rpx;
		transform: translateY(-250rpx);
		margin-bottom: 40rpx;
	}
	.carmodels{
		font-size: 35rpx;
		margin-bottom: 40rpx;
	}
	.carlicense{
		font-size: 30rpx;
	}
	.carinfo{
		margin-left: 20rpx;
	}
	.choose{
		margin-left: 20rpx;
	}
</style>
